<template>
  <div class="login_container">
    <div class="login">
      <div class="login-screen">
        <div class="app-title">
          <h1>互联网医院管理平台</h1>
        </div>

        <div class="login-form">
          <div class="control-group">
            <input
              v-model="username"
              type="text"
              placeholder="请输入用户名"
              @input="handleInput"
            >
          </div>

          <div class="control-group">
            <input
              v-model="passwords"
              type="password"
              placeholder="请输入密码"
              @keyup.enter="userLogin">
          </div>

          <a
            class="btn btn-primary btn-large btn-block"
            href="#"
            @click="userLogin"
          >登录</a>
        </div>
      </div>
    </div>
  </div>

</template>

<script>
const { config } = window
export default {
  data() {
    return {
      ts: this.newStore(),
      username: '',
      passwords: ''
    }
  },
  layout: 'default2',
  methods: {
    handleInput(e) {
      this.username = e.target.value.replace(/[\W]/g, '')
    },
    userLogin() {
      if (this.username == '') {
        this.$message.error('请填写用户名')
        return
      }
      if (this.passwords == '') {
        this.$message.error('请填写密码')
        return
      }
      let res = {
        reqType: 'login',
        username: this.username,
        password: this.passwords,
        lt: config.LT
      }

      let url = 'https://zyext.renyibao.com/LoginServlet'
      if (config.MODE == 'dev') {
        res = {
          reqType: 'login',
          username: this.username,
          password: this.passwords,
          RYBID: config.LT
        }
        url = `${config.APIRootDev}/doctor/LocalDevLogin.dev`
      }
      this.spost(this.ts, url, res).then(ts => {
        console.log(ts.d.errCode)

        if (ts.d.errCode == '200') {
          if (ts.d.errCode == '513') {
            this.$router.push('/login')
            return
          }
          if (ts.d.rybToken) {
            localStorage.setItem(`RYBTOKEN.${config.LT}`, ts.d.rybToken)

            const userInfo = ts.d.rybData

            if (userInfo) {
              localStorage.setItem(
                'userInfo.' + config.LT,
                JSON.stringify(userInfo)
              )
            }

            this.$router.push('/homePage')
          } else {
            this.$message.error(`登录失败：${ts.d.errMessage}`)
            //this.$router.push('/')
          }
        }
      })
    }
  }
}
</script>

<style scoped>
.login_container {
  font-family: Arial;
  background: #4fa0d8;
  padding: 50px;
  height: 100vh;
}
.login {
  margin: 80px auto;
}
.login-screen {
  background-color: #fff;
  padding: 40px;
  border-radius: 5px;
  width: 600px;
  margin: 100px auto;
}

.app-title {
  text-align: center;
  color: #777;
  margin-bottom: 20px;
}

.login-form {
  text-align: center;
}
.control-group {
  margin-bottom: 10px;
}

.control-group input {
  text-align: center;
  background-color: #ecf0f1;
  border: 2px solid transparent;
  border-radius: 3px;
  font-size: 16px;
  font-weight: 200;
  padding: 10px 0;
  width: 400px;
  transition: border 0.5s;
}

.btn {
  background: #4fa0d8;
  color: #ffffff;
  font-size: 16px;
  line-height: 25px;
  padding: 10px 0;
  text-decoration: none;
  text-shadow: none;
  border-radius: 3px;
  box-shadow: none;
  transition: 0.25s;
  display: block;
  width: 400px;
  margin: 0 auto;
}

.btn:hover {
  background-color: #2980b9;
}

.login-link {
  font-size: 12px;
  color: #444;
  display: block;
  margin-top: 12px;
}
</style>
